<template>
  <div>
  <div id="sales">
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="收货人" label="收货人" width="150">
      </el-table-column>
      <el-table-column prop="手机号" label="手机号" width="150">
      </el-table-column>
      <el-table-column prop="地址" label="地址" width="350">
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button type="danger" v-on:click="edit_address(scope.row)" >编辑</el-button>
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope2">
          <el-button  type="danger" v-on:click="is_delete(scope2.row.id)" >删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <br style="height: 1px;background-color: palevioletred">

    <el-button id="add_adress_bu" type="danger" :disabled="bu" style="float: right;width: 100px" v-on:click="add_address_click">添加地址</el-button>


  </div>
    <template>

      <el-dialog title="地址编辑" :visible.sync="editVisible">

        <p>收货人</p>
        <el-input v-model="receiver" placeholder="请输入收货人"></el-input>
        <br>
        <br>
        <p>手机号</p>
        <el-input v-model="phone_number" placeholder="请输入手机号"></el-input>
        <br>
        <br>
        <p>收货地址</p>
        <el-input v-model="address" placeholder="请输入收货地址"></el-input>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" v-on:click="edit_address_click">确定</el-button>
        </div>
      </el-dialog>
    </template>
    <template>

      <el-dialog title="地址添加" :visible.sync="addVisible">

        <p>收货人</p>
        <el-input v-model="receiver" placeholder="请输入收货人"></el-input>
        <br>
        <br>
        <p>手机号</p>
        <el-input v-model="phone_number" placeholder="请输入手机号"></el-input>
        <br>
        <br>
        <p>收货地址</p>
        <el-input v-model="address" placeholder="请输入收货地址"></el-input>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" v-on:click="add_address">确定</el-button>
        </div>
      </el-dialog>
    </template>
  </div>


</template>

<script>
  import qs from 'qs';
  import axios from 'axios'
const BASE_URL = 'http://127.0.0.1:8886';

  export default {
    data() {
      return {
        tableData: [],
        state: 0,
        fits: [],
        id:'',
        address:'',//地址
        phone_number:'',//电话号码
        receiver:'',//收货人
        editVisible: false,
        addVisible: false
      }
    },
    mounted(){

      this.getdata();
    }
    ,
    methods: {

      is_delete(id) { //下单模态框
        this.$confirm('真的要删除吗?', '提示', {
          confirmButtonText: '是的',
          cancelButtonText: '不了不了',
          type: 'warning'
        }).then(() => {
          this.delete_address(id);
        }).catch(() => {
          //this.$router.back();
        });
      },
      add_address_click()
      {
        this.receiver='';
        this.phone_number='';
        this.address='';
        this.addVisible=true;

      },

      edit_address_click()
      {
        axios.post(BASE_URL + '/address/change_address',
          qs.stringify({
            token: window.localStorage.getItem('token'),id:this.id,address:this.address,
            phone_number:this.phone_number, receiver:this.receiver
          }), {'headers': {'Content-Type': 'application/x-www-form-urlencoded'}})
          .then(re => {
            console.log(re.data.备注);
            if (re.data.状态码 === 200) {

              //this.edit_ok();
              this.editVisible=false;
              this.getdata();
            } else {
            }
          })
          .catch((error => {
            console.log(error)
          }))
      },
      delete_address(id)
      {

        axios.post(BASE_URL +'/address/delete_address',
          qs.stringify({token:window.localStorage.getItem('token'),id:id}),
          {'headers': {'Content-Type': 'application/x-www-form-urlencoded'}})
          .then(re =>{
            //console.log(re.data.备注);
            if(re.data.状态码 === 200)
            {

              this.getdata();
            }
            else
            {
            }
          })
          .catch((error =>{
            console.log(error)
          }))
      },
      edit_address(item)
      {

        this.id=item.id;
        this.receiver=item.收货人;
        this.phone_number=item.手机号;
        this.address=item.地址;
        this.editVisible=true;

      },
      getdata()
      {
        this.name=this.getpar('name');//读取home 传来的参数 name  id 商品的id
        console.log("fff"+this.getpar('name'));
        axios.post(BASE_URL +'/address/get_address_list',
          qs.stringify({token:window.localStorage.getItem('token')}),
          {'headers': {'Content-Type': 'application/x-www-form-urlencoded'}})
          .then(re =>{
            console.log(re.data.备注);
            if(re.data.状态码 === 200)
            {
              // this.userInfo.id=true;
              this.tableData= re.data.列表;

              console.log(this.fits);
              console.log(re.data.备注);
            }
            else
            {
            }
          })
          .catch((error =>{
            console.log(error)
          }))
      },
      add_address(){//添加地址
        if(!this.receiver||!this.phone_number||!this.address)
        {
          this.$alert('输入不能为空', '提示', {
            confirmButtonText: '确定',
            callback: action => {

            } });
          return;
        }

          axios.post(BASE_URL + '/address/add_address',
            qs.stringify({
              token: window.localStorage.getItem('token'),address:this.address,
              phone_number:this.phone_number, receiver:this.receiver
            }),
            {'headers': {'Content-Type': 'application/x-www-form-urlencoded'}})
            .then(re => {
              console.log(re.data.备注);
              if (re.data.状态码 === 200) {
                this.addVisible=false;
                this.getdata();
              } else {
              }
            })
            .catch((error => {
              console.log(error)
            }))

      },
      getpar(par){
        //获取当前URL
        let local_url = document.location.href;
        //获取要取得的get参数位置
        let get = local_url.indexOf(par + "=");
        if (get == -1) {
          return "";
        }
        //截取字符串
        let get_par = local_url.slice(par.length + get + 1);
        //判断截取后的字符串是否还有其他get参数
        let nextPar = get_par.indexOf("&");
        if (nextPar != -1) {
          get_par = get_par.slice(0, nextPar);

        }
        nextPar = get_par.indexOf("?");
        if (nextPar != -1) {
          get_par = get_par.slice(0, nextPar);
        }
        nextPar = get_par.indexOf("#");
        if (nextPar != -1) {
          get_par = get_par.slice(0, nextPar);
        }
        return decodeURI(get_par);
      },
      get_image(id)
      {
        return BASE_URL+"/images/small/"+id+".jpg";
      }
    },
  }
</script>

<style scoped>

</style>
